<template>
  <div>
    <v-header :showback='true'>
      <div class="sc-input flex-center" @click.stop.prevent="goSearch">
        <input type="text" placeholder="Search" :value="key" readonly>
        <img class="ico-search" :src="sImg" alt="">
      </div>
      <!-- <div class="sc-cancel" @click.stop.prevent="goBack"><span>取消</span></div> -->
    </v-header>
    <div v-if='hasData'>
      <SearchList :keyword='keywordValue' :fixBar='true'></SearchList>
    </div>
  </div>
</template>
<script>
import SearchList from '../templates/SearchList'
import { ENUM } from '../../common/util'
// import { mapGetters } from 'vuex'
export default {
  data() {
    return {
      key: '',
      keywordValue: '',
      sImg: '//files.eyee.com/mcdn/static/img/search_gray.png', // require('../../assets/img/search_gray.png'),
      list: [],
      isEnd: false,
      isLoading: false,
      pagedata: { sumcount: 0, pagesize: 0, pageindex: 1 },
      hasData: false
    }
  },
  components: { SearchList },
  computed: {
    searchOption: {
      get: function () {
        return this.$store.state.product.searchOption
      },
      set: function () {
        return this.$store.state.product.searchOption
      }
    }
  },
  mounted() {
    this.initShare({ type: 0 })
    let param = this.$route.params
    this.key = param && param.key
    this.hasData = true
    this.initKey()
  },
  methods: {
    goBack() {
      this.searchOption.brandName = ''
      this.searchOption.categoryName = ''
      this.searchOption.category = ''
      this.searchOption.size = ''
      // this.searchOption.brandName = '全部'
      this.$store.dispatch('resetOption', 2)
      this.$store.dispatch('setKeywordBrand', this.searchOption)
      if (window.mqq) window.mqq.ui.popBack()
      else this.$router.back()
    },
    goSearch() {
      // newsSearch  product
      this.$router.replace('/search/' + ENUM.SearchType.product.val)
      var type = 2
      this.$store.dispatch('resetOption', type)
    },
    initKey() {
      var key = this.$route.params.key
      var set = this.searchOption
      console.log('searchaaaaaaaaaaOption', this.searchOption)

      if (key) {
        // key =  this.keywordValue =''
        this.key = key
        this.keywordValue = key
        // console.log(set.value, '--------------------')
        if (set.brandName != '全部' || set.categoryName != '全部' || set.size || set.category) {
          this.key +=
            ' ' +
            (set.brandName != '全部' && set.brandName.toLowerCase() != key.toLowerCase() ? set.brandName : '') +
            ' ' +
            (set.categoryName != '全部' && set.categoryName.toLowerCase() != key.toLowerCase() ? set.categoryName : set.category ? set.category : ' ') +
            ' ' +
            (set.size ? set.size : '')
          this.keywordValue =
            // ' ' +
            // (set.brandName != '全部' && set.brandName != key ? set.brandName : '') +
            // ' ' +
            // (set.categoryName != '全部' ? set.categoryName : set.category ? set.category : '') +
            // ' ' +
            set.value ? set.value : ''
        }
      }
      // console.log(this.keywordValue,'关键字--------------------------')
      // if (set.keyword == '全部'&&set.brandName == '全部' && set.categoryName == '全部' &&set.sizeName== '全部') {
      //   this.key=''
      // }
    }
  },
  watch: {
    searchOption: function (newO, oldv) {
      console.log('searrrrrrrrrrrr', newO)
      this.searchOption = newO
      this.initKey()
    }
  }
}
</script>
